<template>
    <van-form @submit="submit" style="margin:5px 10px;">
        <van-field
            readonly
            clickable
            name="picker"
            :value="typename"
            label="批改类型"
            placeholder="点击选择批改类型"
            @click="showPicker = true"
        />
        <van-popup v-model="showPicker" position="bottom">
            <van-picker
                show-toolbar
                :columns="columns"
                @confirm="onConfirm"
                @cancel="showPicker = false"
            />
        </van-popup>
        <van-field
            v-model="reason"
            name="退款原因"
            label="退款原因"
            placeholder="退款原因"
            :rules="[{ required: true, message: '请填写退款原因' }]"
            type="textarea"
            rows="3"
            autosize
        />
        <div style="margin: 16px;">
            <van-button round block type="info" native-type="submit">提交</van-button>
        </div>
    </van-form>
</template>

<script>
    export default {
        props: {
            value: {
                type: Object,
                default: function () {
                    return {}
                }
            },
            data:{
                type: Object,
                default: function () {
                    return {}
                }
            }
        },
        data() {
            return {
                showPicker:false,
                reason:"",
                type:"",
                typename:"",
                columns: [
                    {
                        text:"内容错误",
                        value:"0"
                    },
                    {
                        text:"付款方式错误",
                        value:"1"
                    },
                ],
            }
        },
        watch: {
        },
        computed: {
            
        },

        methods: {
            onConfirm($event){
                this.type = $event.value;
                this.typename = $event.text;
                this.showPicker = false;
            },
            submit(){
                var that = this;
                this.$api.applypg({
                    rowguid:that.$route.query.rowguid,
                    reason: that.reason,
                    pgtype: that.type,
                }).then((data)=>{
                    if(data.code != 'error'){
                        that.$notify({
                            type:"success",
                            message: "申请批改成功"
                        });
                        that.$router.push({
                            path: '/order',
                            query: {
                                id: that.$route.query.rowguid
                            }
                        })
                    }
                })
            }
        },
        mounted: function () {

        }
    };
</script>
<style lang="less" scoped>
    
</style>